@import "../../common/css/size.scss";


/*css 重置*/
* {
  padding: 0;
  font-family: 'AvantGuard';
  /*box-sizing: content-box;*/
  /*word-break: break-all;*/
  -webkit-overflow-scrolling: touch;
  font-size: $_14;
 }
  p{
    margin: 0;
  }
/*<!-- 自定义字体 -->*/
@font-face {
  font-family: AvantGuard;
  src: url("http://genetuan.oss-cn-shenzhen.aliyuncs.com/commons/avantguard.ttf"); /* TTF file for CSS3 browsers */
  font-weight: normal;
  font-style: normal;
}
.number{
  font-family: 'DINCond-Bold';
}
// 部分数字字体
@font-face {
  font-family: DINCond-Bold;
  src: url("./font/DINCond-Bold.otf"); /* TTF file for CSS3 browsers */
  font-weight: normal;
  font-style: normal;
}

html {
  overflow: hidden;
  height: 100%;
}

body {
  margin: 0;
  padding: 0;
  background: #fff ;
  height:100%;
  color:#242424;
  -webkit-overflow-scrolling:touch;
}
ul {
  margin-bottom: 0;
}
ul, ol, li {
  list-style-type: none;
}
a{
  color: #666
}
a:hover{
  cursor:pointer
}
a:hover {
  color: #5A8CEE;
  text-decoration:none;
}
img{
  max-width: 100%;
  //max-height: 100%;
}

/*css通用样式库 部分基于面对属性命名*/
.fl{
  float: left
}
.fr{
  float: right
}
.tc{
  text-align: center
}
.tl{
  text-align: left
}
.tr{
  text-align: right
}

.dfr{
  display: flex;
  flex-direction:row //伸缩盒从左到右
}
.dfc{
  display: flex;
  flex-direction:column //伸缩盒从上到下
}
//justify-content
.jsfs{
  justify-content: flex-start;
}
.jsfe{
  justify-content: flex-end;
}
.jsc{
  justify-content: center;
}
.jssb{
  justify-content: space-between;
}
.jssa{
  justify-content: space-around;
}
//align-items
.aifs{
  align-items: flex-start
}
.aife{
  align-items: flex-end
}
.aic{
  align-items: center
}
.aib{
  align-items: baseline
}
//align-self
.asfs{
  align-self: flex-start
}
.asfe{
  align-self: flex-end
}
.asc{
  align-self: center
}
.asb{
  align-self: baseline
}
//flex-wrap
.fww{
  flex-wrap: wrap;
}
//font-size
.fs4{
  font-size:0.4rem;
}
.fs45{
  font-size: 0.45rem
}
.fs5{
  font-size: 0.5rem
}
.fs55{
  font-size: 0.55rem
}
.fs6{
  font-size: 0.6rem;
}
.fs65{
  font-size: 0.65rem;
}
.fsL{
  font-size: 1rem;
}
.fwb{
  font-weight: bold;
}
.f6{
  font-size: $_5;
}
.f8{
  font-size: $_8;
}
.f10{
  font-size: $_10;
}
.f12{
  font-size:$_12;
}
.f14{
  font-size:$_14;
}
.f16{
  font-size:$_16;
}
.f18{
  font-size:$_18;
}
.f20{
  font-size: $_20;
}
.f30{
  font-size: $_30;
}
.f24{
  font-size: $_24;
}
.f26{
  font-size: $_26;
}
.f36{
  font-size: $_36;
}
.f40{
  font-size: $_40;
}
//color
.cff{
  color: #fff;
}
.cbff{
  background: #fff;
}

.c33{
  color: #333;
}
.c00{
  color: #000;
}
.cred{
  color: red;
}
.cbred{
  background: red;
}
.cbred2{
  background: #F45975;
}
.cred3{
  color: #B4282D;
}
.cred4{
  color: #F36C7B;
}
.cmain{
  color: #4885F0
}
.cbmain{
  background: #4885F0
}
.cblue{
  color: #4876E6;
}
.cbgreen{
  background: #6DC772;
}
.cborange{
  background: #FEA54C;
}
.cpurple{
  color: #A844BA;
}
.cbpurple{
  background: #A844BA;
}
.cOrage{
  color: #FEA54C;
}
.cyellow{
  color:#F8C44A;
}
.c7f{
  color: #7F7F7F
}
.c78{
  color: #787878;
}
.c50{
  color: #50505A;
}
.c5d6{
  color: #5D6061;
}
.c4c4{
  color: #4C4E5B;
}

.c36{
  color: #363636;
}
.c66{
  color:#666
}
.c03a{
  color:#003A00
}
.c8C8{
  color: #8C889F
}
.c83{
  color: #838383;
}
.c929{
  color: #929498;
}
.cAF{
color: #AFAFAF 
}
.c798{
  color: #798084;
}
.c38{
  color: #383838;
}
.c6a6{
  color:#6A6B6B;
}
.c9d9{
  color:#9D9D9D;
}


.hide{
  display: none;
}
.show{
  display: block;
}
//a
.a-formal {
  color: #5A8CEE;
  text-decoration: underline !important;
}
//text-line
.text-line{
  text-decoration: line-through;
}
//margin
.mgn-auto {
  margin: 0 auto;
}
.clear-both {
  clear: both;
  border: none !important;
  height: 0 !important;
  width: 0 !important;
}

//letter space
.ls1{
  letter-spacing: $_1;
}
.ls2{
  letter-spacing: $_2;
}
.ls3{
  letter-spacing: $_3;
}

//hide show
.hides{
  display: none;
}
.show{
  display: block;
}
.visible{
  visibility :visible ;
}
.invisible{
  visibility :hidden ;
}
/*宽高*/
.w100{
  width: 100%;
}
.h100{
  height: 100%;
}
.wh100{
  width: 100%;
  height: 100%;
}

/*position*/
.pr{
  position: relative;
}
.pa{
  position: absolute;
}

/*对于网站通用的表单 导航栏 菜单 文本框 模态框等 每个内容单独分文件处理 这样能一目了然*/

/*网站公共结构样式 单独分文件处理*/
